<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>OpenLayers v8.2.0 API - Class: Icon</title>
    <script src="scripts/prettify/prettify.js"></script>
    <script src="scripts/prettify/lang-css.js"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"
        crossorigin="anonymous"></script>
    <link rel="stylesheet" type="text/css"
        href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css"
        href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.2/css/fontawesome.min.css"
        crossorigin="anonymous">
    <link rel="stylesheet" type="text/css"
        href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.2/css/solid.css" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css"
        href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.2/css/brands.css" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="styles/prettify-tomorrow.css">
    <link rel="stylesheet" type="text/css" href="styles/jaguar.css">
    <link rel="stylesheet" type="text/css" href="styles/carbon.css">
    <link rel="stylesheet" type="text/css" href="/theme/ol.css">
    <link rel="stylesheet" type="text/css" href="/theme/site.css">
</head>

<body>
    <header class="navbar navbar-expand-sm navbar-dark mb-3 px-3 py-0 fixed-top" role="navigation">
        <a class="navbar-brand" href="/"><img src="/theme/img/logo-dark.svg" width="70" height="70"
                alt="">&nbsp;OpenLayers</a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#olmenu"
            aria-controls="olmenu" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <!-- menu items that get hidden below 768px width -->
        <nav class="collapse navbar-collapse" id="olmenu">
            <ul class="nav navbar-nav ms-auto">
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="docdropdown" role="button"
                        data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Docs</a>
                    <div class="dropdown-menu dropdown-menu-end mb-3" aria-labelledby="docdropdown">
                        <a class="dropdown-item" href="/doc/">Docs</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="/doc/quickstart.html"><i
                                class="fa fa-check fa-fw me-2 fa-lg"></i>快速入门</a>
                        <a class="dropdown-item" href="/doc/faq.html"><i
                                class="fa fa-question fa-fw me-2 fa-lg"></i>FAQ</a>
                        <a class="dropdown-item" href="/doc/tutorials/"><i
                                class="fa fa-book fa-fw me-2 fa-lg"></i>Tutorials</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="https://stackoverflow.com/questions/tagged/openlayers"><i
                                class="fab fa-stack-overflow fa-fw me-2"></i>Ask a Question</a>
                    </div>
                </li>
                <li class="nav-item"><a class="nav-link" href="/en/latest/examples/">Examples</a></li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="apidropdown" role="button"
                        data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        <i class="fa fa-sitemap me-1"></i>API
                    </a>
                    <div class="dropdown-menu dropdown-menu-end mb-3" aria-labelledby="apidropdown">
                        <a class="dropdown-item" href="/en/latest/apidoc/"><i
                                class="fa fa-sitemap fa-fw me-2 fa-lg"></i>v8.2.0
                            (latest)</a </div>
                </li>
            </ul>
        </nav>
    </header>

    <div class="container-fluid">
        <div id="wrap" class="row">
            <div class="navigation col-md-4 col-lg-3">
                <div class="search-wrapper">
                    <div class="search">
                        <input id="search" type="text" autocomplete="off" class="form-control input-sm"
                            placeholder="Search Documentation">
                    </div>
                </div>
                <div class="navigation-list-wrapper">
                    <ul class="navigation-list search-empty">
                        <li class="item item-class toggle-manual toggle-manual-show"
                            data-longname="module:ol/style/Icon~Icon" data-name="ol/style/icon">
                            <span class="title toggle">
                                <span class="fa fa-chevron-right me-2 mt-1"></span>
                                <span><a href="module-ol_style_Icon-Icon.html">ol​/style​/Icon</a></span>
                            </span>
                            <div class="member-list" data-type="methods">
                                <span class="subtitle">Methods</span>
                                <ul>
                                    <li data-name="clone"><a href="module-ol_style_Icon-Icon.html#clone">clone</a>
                                    <li data-name="getanchor"><a
                                            href="module-ol_style_Icon-Icon.html#getAnchor">getAnchor</a>
                                    <li data-name="getcolor"><a
                                            href="module-ol_style_Icon-Icon.html#getColor">getColor</a>
                                    <li data-name="getdecluttermode"><a
                                            href="module-ol_style_Icon-Icon.html#getDeclutterMode">getDeclutterMode</a>
                                    <li data-name="getdisplacement"><a
                                            href="module-ol_style_Icon-Icon.html#getDisplacement">getDisplacement</a>
                                    <li data-name="getheight"><a
                                            href="module-ol_style_Icon-Icon.html#getHeight">getHeight</a>
                                    <li data-name="getimage"><a
                                            href="module-ol_style_Icon-Icon.html#getImage">getImage</a>
                                    <li data-name="getopacity"><a
                                            href="module-ol_style_Icon-Icon.html#getOpacity">getOpacity</a>
                                    <li data-name="getorigin"><a
                                            href="module-ol_style_Icon-Icon.html#getOrigin">getOrigin</a>
                                    <li data-name="getpixelratio"><a
                                            href="module-ol_style_Icon-Icon.html#getPixelRatio">getPixelRatio</a>
                                    <li data-name="getrotatewithview"><a
                                            href="module-ol_style_Icon-Icon.html#getRotateWithView">getRotateWithView</a>
                                    <li data-name="getrotation"><a
                                            href="module-ol_style_Icon-Icon.html#getRotation">getRotation</a>
                                    <li data-name="getscale"><a
                                            href="module-ol_style_Icon-Icon.html#getScale">getScale</a>
                                    <li data-name="getsize"><a href="module-ol_style_Icon-Icon.html#getSize">getSize</a>
                                    <li data-name="getsrc"><a href="module-ol_style_Icon-Icon.html#getSrc">getSrc</a>
                                    <li data-name="getwidth"><a
                                            href="module-ol_style_Icon-Icon.html#getWidth">getWidth</a>
                                    <li data-name="load"><a href="module-ol_style_Icon-Icon.html#load">load</a>
                                    <li data-name="setanchor"><a
                                            href="module-ol_style_Icon-Icon.html#setAnchor">setAnchor</a>
                                    <li data-name="setdisplacement"><a
                                            href="module-ol_style_Icon-Icon.html#setDisplacement">setDisplacement</a>
                                    <li data-name="setopacity"><a
                                            href="module-ol_style_Icon-Icon.html#setOpacity">setOpacity</a>
                                    <li data-name="setrotatewithview"><a
                                            href="module-ol_style_Icon-Icon.html#setRotateWithView">setRotateWithView</a>
                                    <li data-name="setrotation"><a
                                            href="module-ol_style_Icon-Icon.html#setRotation">setRotation</a>
                                    <li data-name="setscale"><a
                                            href="module-ol_style_Icon-Icon.html#setScale">setScale</a>
                                </ul>
                            </div>
                        <li class="loading">Loading …
                    </ul>
                </div>
            </div>

            <div class="main col-md-8 col-lg-9">
                <h1 class="page-title" data-filename="module-ol_style_Icon-Icon.html">Class: Icon</h1>
                <div id="latest-check" class="alert alert-warning alert-dismissible" role="alert" style="display:none">
                    <button id="latest-dismiss" type="button" class="btn-close" data-bs-dismiss="alert"
                        aria-label="Close"></button>
                    This documentation is for OpenLayers v<span id="package-version">8.2.0</span>. The <a
                        id="latest-link" href="#" class="alert-link">latest</a> is v<span id="latest-version"></span>.
                </div>




                <section class="content">

                    <header>
                        <h2 class="my-3">
                            <span class="ancestors"><a href="module-ol_style_Icon.html">ol/style/Icon</a>~</span>Icon
                        </h2>
                        <br>



                        <pre
                            class="prettyprint source"><code>import Icon from '<a href="module-ol_style_Icon.html">ol/style/Icon</a>.js';</code></pre>


                        <div class="row p-3 ">
                            <!-- <div id="ad" class="col-lg-5 order-2 align-self-center border rounded bg-light ">
                                <script async type="text/javascript"
                                    src="https://cdn.carbonads.com/carbon.js?serve=CE7DV53U&placement=openlayersorg"
                                    id="_carbonads_js"></script>
                            </div> -->

                            <div class="class-description col-lg-7 align-self-center ps-0">
                                <p>设置矢量要素的图标样式。</p>
                            </div>

                        </div>
                    </header>

                    <article>
                        <div class="container-overview">



                            <dl>

                                <dt class="">

                                    <div class="nameContainer">
                                        <div class="anchor" id="Icon">
                                        </div>
                                        <h4 class="name">
                                            new Icon<span class="signature">(<span
                                                    class="optional">options</span>)</span>



                                        </h4>

                                        <div class="tag-source">
                                            <a
                                                href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                            <a
                                                href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L82">line
                                                82</a>
                                        </div>

                                    </div>


                                </dt>
                                <dd class="">













                                    <table class="params">
                                        <thead>
                                            <tr>

                                                <th>Name</th>


                                                <th>Type</th>

                                                <th class="last">Description</th>
                                            </tr>
                                        </thead>

                                        <tbody>


                                            <tr class="">

                                                <td class="name"><code>anchor</code></td>



                                                <td class="type">


                                                    <span class="param-type">Array.&lt;number></span>



                                                    (defaults to [0.5, 0.5])


                                                </td>



                                                <td class="description last">

                                                    <p>锚。默认值为图标中心。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>anchorOrigin</code></td>



                                                <td class="type">


                                                    <span class="param-type"><a
                                                            href="module-ol_style_Icon.html#~IconOrigin">IconOrigin</a></span>



                                                    (defaults to 'top-left')


                                                </td>



                                                <td class="description last">

                                                    <p>锚的起源: <code>bottom-left</code>,
                                                        <code>bottom-right</code>,
                                                        <code>top-left</code> or <code>top-right</code>.
                                                    </p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>anchorXUnits</code></td>



                                                <td class="type">


                                                    <span class="param-type"><a
                                                            href="module-ol_style_Icon.html#~IconAnchorUnits">IconAnchorUnits</a></span>



                                                    (defaults to 'fraction')


                                                </td>



                                                <td class="description last">

                                                    <p>指定锚点x值的单位。<code>'fraction'</code> 值表示x值是图标的一部分。
                                                        <code>'pixels'</code> 值表示x值的像素数。
                                                    </p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>anchorYUnits</code></td>



                                                <td class="type">


                                                    <span class="param-type"><a
                                                            href="module-ol_style_Icon.html#~IconAnchorUnits">IconAnchorUnits</a></span>



                                                    (defaults to 'fraction')


                                                </td>



                                                <td class="description last">

                                                    <p>指定锚点y值的单位。<code>'fraction'</code> 值表示y值是图标的一部分。
                                                        <code>'pixels'</code> 值表示y值的像素数。
                                                    </p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>color</code></td>



                                                <td class="type">


                                                    <span class="param-type"><a
                                                            href="module-ol_color.html#~Color">Color</a></span>
                                                    |

                                                    <span class="param-type">string</span>

                                                    | undefined


                                                </td>



                                                <td class="description last">

                                                    <p>给图标上色的颜色。如果没有指定，图标将保持不变。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>crossOrigin</code></td>



                                                <td class="type">


                                                    <span class="param-type">null</span>
                                                    |

                                                    <span class="param-type">string</span>

                                                    | undefined


                                                </td>



                                                <td class="description last">

                                                    <p>已加载图像的<code>crossOrigin</code>属性。请注意，如果您想使用Canvas渲染器访问像素数据，则必须提供
                                                        <code>icon-cross-origin</code>值。有关更多详细信息，请参见
                                                    </p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>img</code></td>



                                                <td class="type">


                                                    <span class="param-type">HTMLImageElement</span>
                                                    |

                                                    <span class="param-type">HTMLCanvasElement</span>
                                                    |

                                                    <span class="param-type">ImageBitmap</span>

                                                    | undefined


                                                </td>



                                                <td class="description last">

                                                    <p>图标的图像对象。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>displacement</code></td>



                                                <td class="type">


                                                    <span class="param-type">Array.&lt;number></span>



                                                    (defaults to [0, 0])


                                                </td>



                                                <td class="description last">

                                                    <p>图标在像素中的位移。正值会将图标向右和向上移动。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>opacity</code></td>



                                                <td class="type">


                                                    <span class="param-type">number</span>



                                                    (defaults to 1)


                                                </td>



                                                <td class="description last">

                                                    <p>图标的不透明度。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>width</code></td>



                                                <td class="type">


                                                    <span class="param-type">number</span>

                                                    | undefined


                                                </td>



                                                <td class="description last">

                                                    <p>图标在像素中的宽度。这不能与 <code>scale</code>一起使用。
                                                    </p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>height</code></td>



                                                <td class="type">


                                                    <span class="param-type">number</span>

                                                    | undefined


                                                </td>



                                                <td class="description last">

                                                    <p>图标在像素中的高度。这不能与<code>scale</code>一起使用。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>scale</code></td>



                                                <td class="type">


                                                    <span class="param-type">number</span>
                                                    |

                                                    <span class="param-type"><a
                                                            href="module-ol_size.html#~Size">Size</a></span>



                                                    (defaults to 1)


                                                </td>



                                                <td class="description last">

                                                    <p>缩放比例。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>rotateWithView</code></td>



                                                <td class="type">


                                                    <span class="param-type">boolean</span>



                                                    (defaults to false)


                                                </td>



                                                <td class="description last">

                                                    <p>是否随视图旋转图标。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>rotation</code></td>



                                                <td class="type">


                                                    <span class="param-type">number</span>



                                                    (defaults to 0)


                                                </td>



                                                <td class="description last">

                                                    <p>旋转角度（以弧度为单位）（正旋转为顺时针）。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>offset</code></td>



                                                <td class="type">


                                                    <span class="param-type">Array.&lt;number></span>



                                                    (defaults to [0, 0])


                                                </td>



                                                <td class="description last">

                                                    <p>
                                                        偏移量，与<code>size</code>和<code> 偏移量原点(offsetOrigin)</code>一起使用，从原始（子画面）图像中定义要使用的子矩形。
                                                    </p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>offsetOrigin</code></td>



                                                <td class="type">


                                                    <span class="param-type"><a
                                                            href="module-ol_style_Icon.html#~IconOrigin">IconOrigin</a></span>



                                                    (defaults to 'top-left')


                                                </td>



                                                <td class="description last">

                                                    <p>偏移量的原点：<code>bottom-left</code>,
                                                        <code>bottom-right</code>,
                                                        <code>top-left</code> or <code>top-right</code>.
                                                    </p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>size</code></td>



                                                <td class="type">


                                                    <span class="param-type"><a
                                                            href="module-ol_size.html#~Size">Size</a></span>

                                                    | undefined


                                                </td>



                                                <td class="description last">

                                                    <p>图标以像素为单位的大小。与 <code>offset</code>一起使用，从原始（子画面）图像中定义要使用的子矩形。</p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>src</code></td>



                                                <td class="type">


                                                    <span class="param-type">string</span>

                                                    | undefined


                                                </td>



                                                <td class="description last">

                                                    <p>图片源URL。
                                                    </p>
                                                </td>
                                            </tr>



                                            <tr class="">

                                                <td class="name"><code>declutterMode</code></td>



                                                <td class="type">


                                                    <span class="param-type">"declutter"</span>
                                                    |

                                                    <span class="param-type">"obstacle"</span>
                                                    |

                                                    <span class="param-type">"none"</span>
                                                    |

                                                    <span class="param-type">undefined</span>




                                                </td>



                                                <td class="description last">

                                                    <p>消除混乱模式。</p>
                                                </td>
                                            </tr>


                                        </tbody>
                                    </table>




                                    <dl class="details">





















                                    </dl>













                                </dd>

                            </dl>

                        </div>




                        <h3 class="subsection-title">Extends</h3>

                        <ul>
                            <li><a href="module-ol_style_Image-ImageStyle.html">ImageStyle</a></li>
                        </ul>















                        <h3 class="subsection-title">Methods</h3>

                        <dl>


                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="clone">
                                    </div>
                                    <h4 class="name">
                                        clone<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{<a
                                                href="module-ol_style_Icon-Icon.html">Icon</a>}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L288">line
                                            288</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>克隆样式。底层的 Image/HTMLCanvasElement 未被克隆。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                The cloned style.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getAnchor">
                                    </div>
                                    <h4 class="name">
                                        getAnchor<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{Array.&lt;number>}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L328">line
                                            328</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取像素中的锚点。锚点决定符号的中心点。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Anchor.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getColor">
                                    </div>
                                    <h4 class="name">
                                        getColor<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{<a
                                                href="module-ol_color.html#~Color">Color</a>}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L398">line
                                            398</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取图标颜色。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Color.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="getDeclutterMode">
                                    </div>
                                    <h4 class="name">
                                        getDeclutterMode<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{"declutter" | "obstacle" | "none" |
                                            undefined}</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#getDeclutterMode">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L147">line
                                            147</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取形状的简化模式</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Shape's declutter mode
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="getDisplacement">
                                    </div>
                                    <h4 class="name">
                                        getDisplacement<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{Array.&lt;number>}</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#getDisplacement">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L138">line
                                            138</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取形状的位移</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Shape's center displacement
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getHeight">
                                    </div>
                                    <h4 class="name">
                                        getHeight<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{number}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L518">line
                                            518</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取图标的高度（以像素为单位）。当图标图像尚未加载时，将返回 undefined。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Icon height (in pixels).
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getImage">
                                    </div>
                                    <h4 class="name">
                                        getImage<span class="signature">(pixelRatio)</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{HTMLImageElement | HTMLCanvasElement |
                                            ImageBitmap}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L409">line
                                            409</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取图片图标。</p>
                                </div>










                                <table class="params">
                                    <thead>
                                        <tr>

                                            <th>Name</th>


                                            <th>Type</th>

                                            <th class="last">Description</th>
                                        </tr>
                                    </thead>

                                    <tbody>


                                        <tr class="">

                                            <td class="name"><code>pixelRatio</code></td>



                                            <td class="type">


                                                <span class="param-type">number</span>




                                            </td>



                                            <td class="description last">

                                                <p>像素比率。</p>
                                            </td>
                                        </tr>


                                    </tbody>
                                </table>




                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Image or Canvas element. If the Icon
                                style was configured with <code>src</code> or with a not let loaded <code>img</code>, an
                                <code>ImageBitmap</code> will be returned.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="getOpacity">
                                    </div>
                                    <h4 class="name">
                                        getOpacity<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{number}</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#getOpacity">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L94">line
                                            94</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取符号的不透明度。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Opacity.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getOrigin">
                                    </div>
                                    <h4 class="name">
                                        getOrigin<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{Array.&lt;number>}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L449">line
                                            449</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取符号的原点。</p>
                                </div>










                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Origin.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getPixelRatio">
                                    </div>
                                    <h4 class="name">
                                        getPixelRatio<span class="signature">(pixelRatio)</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{number}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L419">line
                                            419</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取像素比。</p>
                                </div>










                                <table class="params">
                                    <thead>
                                        <tr>

                                            <th>Name</th>


                                            <th>Type</th>

                                            <th class="last">Description</th>
                                        </tr>
                                    </thead>

                                    <tbody>


                                        <tr class="">

                                            <td class="name"><code>pixelRatio</code></td>



                                            <td class="type">


                                                <span class="param-type">number</span>




                                            </td>



                                            <td class="description last">

                                                <p像素比率。< /p>
                                            </td>
                                        </tr>


                                    </tbody>
                                </table>




                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                The pixel ratio of the image.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="getRotateWithView">
                                    </div>
                                    <h4 class="name">
                                        getRotateWithView<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{boolean}</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#getRotateWithView">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L103">line
                                            103</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>确定符号是否随地图旋转。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Rotate with map.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="getRotation">
                                    </div>
                                    <h4 class="name">
                                        getRotation<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{number}</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#getRotation">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L112">line
                                            112</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取符号的旋转角度。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Rotation.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="getScale">
                                    </div>
                                    <h4 class="name">
                                        getScale<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{number | <a
                                                href="module-ol_size.html#~Size">Size</a>}</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#getScale">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L121">line
                                            121</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取缩放的比例。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Scale.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getSize">
                                    </div>
                                    <h4 class="name">
                                        getSize<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{<a
                                                href="module-ol_size.html#~Size">Size</a>}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L493">line
                                            493</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取图标的大小（以像素为单位）。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Image size.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getSrc">
                                    </div>
                                    <h4 class="name">
                                        getSrc<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{string | undefined}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L484">line
                                            484</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>Get the image URL.</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Image src.
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="getWidth">
                                    </div>
                                    <h4 class="name">
                                        getWidth<span class="signature">()</span><span
                                            class="fa fa-arrow-circle-right"></span><span
                                            class="type-signature returnType">{number}</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L502">line
                                            502</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>获取图标的宽度（以像素为单位）。当图标图像尚未加载时，将返回 undefined。</p>
                                </div>











                                <dl class="details">





















                                </dl>















                                <h5>Returns:</h5>
                                Icon width (in pixels).
                                <br />




                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="load">
                                    </div>
                                    <h4 class="name">
                                        load<span class="signature">()</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L554">line
                                            554</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>加载尚未加载的 URI。渲染具有图标样式的要素时，矢量渲染器将自动调用此方法。但是，您可能希望出于预加载或其他目的自行调用此方法。</p>
                                </div>











                                <dl class="details">





















                                </dl>













                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="setAnchor">
                                    </div>
                                    <h4 class="name">
                                        setAnchor<span class="signature">(anchor)</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L388">line
                                            388</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>设置锚点。确定中心点。</p>
                                </div>










                                <table class="params">
                                    <thead>
                                        <tr>

                                            <th>Name</th>


                                            <th>Type</th>

                                            <th class="last">Description</th>
                                        </tr>
                                    </thead>

                                    <tbody>


                                        <tr class="">

                                            <td class="name"><code>anchor</code></td>



                                            <td class="type">


                                                <span class="param-type">Array.&lt;number></span>




                                            </td>



                                            <td class="description last">

                                                <p>Anchor.</p>
                                            </td>
                                        </tr>


                                    </tbody>
                                </table>




                                <dl class="details">





















                                </dl>













                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="setDisplacement">
                                    </div>
                                    <h4 class="name">
                                        setDisplacement<span class="signature">(displacement)</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#setDisplacement">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L228">line
                                            228</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>设置位移。</p>
                                </div>










                                <table class="params">
                                    <thead>
                                        <tr>

                                            <th>Name</th>


                                            <th>Type</th>

                                            <th class="last">Description</th>
                                        </tr>
                                    </thead>

                                    <tbody>


                                        <tr class="">

                                            <td class="name"><code>displacement</code></td>



                                            <td class="type">


                                                <span class="param-type">Array.&lt;number></span>




                                            </td>



                                            <td class="description last">

                                                <p>位移。</p>
                                            </td>
                                        </tr>


                                    </tbody>
                                </table>




                                <dl class="details">





















                                </dl>













                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="setOpacity">
                                    </div>
                                    <h4 class="name">
                                        setOpacity<span class="signature">(opacity)</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#setOpacity">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L238">line
                                            238</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>设置不透明度。</p>
                                </div>










                                <table class="params">
                                    <thead>
                                        <tr>

                                            <th>Name</th>


                                            <th>Type</th>

                                            <th class="last">Description</th>
                                        </tr>
                                    </thead>

                                    <tbody>


                                        <tr class="">

                                            <td class="name"><code>opacity</code></td>



                                            <td class="type">


                                                <span class="param-type">number</span>




                                            </td>



                                            <td class="description last">

                                                <p>透明度.</p>
                                            </td>
                                        </tr>


                                    </tbody>
                                </table>




                                <dl class="details">





















                                </dl>













                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="setRotateWithView">
                                    </div>
                                    <h4 class="name">
                                        setRotateWithView<span class="signature">(rotateWithView)</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#setRotateWithView">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L248">line
                                            248</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>设置是否随视图旋转样式。</p>
                                </div>










                                <table class="params">
                                    <thead>
                                        <tr>

                                            <th>Name</th>


                                            <th>Type</th>

                                            <th class="last">Description</th>
                                        </tr>
                                    </thead>

                                    <tbody>


                                        <tr class="">

                                            <td class="name"><code>rotateWithView</code></td>



                                            <td class="type">


                                                <span class="param-type">boolean</span>




                                            </td>



                                            <td class="description last">

                                                <p>Rotate with map.</p>
                                            </td>
                                        </tr>


                                    </tbody>
                                </table>




                                <dl class="details">





















                                </dl>













                            </dd>




                            <dt class="">

                                <div class="nameContainer inherited">
                                    <div class="anchor" id="setRotation">
                                    </div>
                                    <h4 class="name">
                                        setRotation<span class="signature">(rotation)</span>

                                        <span class="inherited"><a
                                                href="module-ol_style_Image-ImageStyle.html#setRotation">inherited</a></span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js">style/Image.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Image.js#L258">line
                                            258</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>设置旋转角度</p>
                                </div>










                                <table class="params">
                                    <thead>
                                        <tr>

                                            <th>Name</th>


                                            <th>Type</th>

                                            <th class="last">Description</th>
                                        </tr>
                                    </thead>

                                    <tbody>


                                        <tr class="">

                                            <td class="name"><code>rotation</code></td>



                                            <td class="type">


                                                <span class="param-type">number</span>




                                            </td>



                                            <td class="description last">

                                                <p>旋转角度。</p>
                                            </td>
                                        </tr>


                                    </tbody>
                                </table>




                                <dl class="details">





















                                </dl>













                            </dd>




                            <dt class="">

                                <div class="nameContainer">
                                    <div class="anchor" id="setScale">
                                    </div>
                                    <h4 class="name">
                                        setScale<span class="signature">(scale)</span>



                                    </h4>

                                    <div class="tag-source">
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js">style/Icon.js</a>,
                                        <a
                                            href="https://github.com/openlayers/openlayers/blob/v8.2.0/src/ol/style/Icon.js#L535">line
                                            535</a>
                                    </div>

                                </div>


                            </dt>
                            <dd class="">




                                <div class="description">
                                    <p>设置缩放</p>
                                </div>










                                <table class="params">
                                    <thead>
                                        <tr>

                                            <th>Name</th>


                                            <th>Type</th>

                                            <th class="last">Description</th>
                                        </tr>
                                    </thead>

                                    <tbody>


                                        <tr class="">

                                            <td class="name"><code>scale</code></td>



                                            <td class="type">


                                                <span class="param-type">number</span>
                                                |

                                                <span class="param-type"><a
                                                        href="module-ol_size.html#~Size">Size</a></span>




                                            </td>



                                            <td class="description last">

                                                <p>缩放比例。</p>
                                            </td>
                                        </tr>


                                    </tbody>
                                </table>




                                <dl class="details">





















                                </dl>













                            </dd>

                        </dl>





                    </article>

                </section>




            </div>
        </div>
    </div>
    <script>prettyPrint();</script>
    <script src="scripts/linenumber.js"></script>
    <script src="scripts/main.js"></script>
</body>

</html>